<script>
import axios from "axios";

export default {
  name: "MainHeader",
  methods:{
    toLogin(){
      this.$router.push("/login");
  },
   outLogin(){
      localStorage.removeItem("token");
     window.open("http://dmsandfss.site","_self")
      window.location.reload();
   },
   publishResource(){
     this.$router.push("/publish");
   }
  },
  data(){
    return{
      isLoggedIn:false,
      picSrc:"",
      userId:-1
    }
  },

  mounted() {
    console.log("杜明珅");
    const token = localStorage.getItem("token");
    console.log(token);
    axios.post("http://113.44.66.99:8080/getUserMessage",{},{
      headers:{
        Authorization:token
      }
    }).then(res=>{
      console.log(res.data)
      if(res.data.code==0){
        this.isLoggedIn=true;
        this.picSrc=res.data.data.head_pic;
        this.userId=res.data.data.userId;
      }
      console.log("导航栏接收到了数据")
    })

  }
}
</script>

<template>

  <el-header class="w-full h-20 fixed flex border-b border-gray-500/40 bg-white shadow-2xl flex">
    <div class=" w-1/6"></div>
    <div class="h-full grow flex items-center justify-between ">
      <img src="/logo素材.png" class="w-30 h-20">
      <el-button class="h-full text-2xl" @click="toLogin" v-if="!isLoggedIn">登陆/注册</el-button>
      <div v-if="isLoggedIn">
        <el-dropdown class="mr-10">
          <a :href="'/user.html?userId='+userId"><el-avatar class="hover:animate__animated hover:animate__pulse" size="large" shape="circle" :src="picSrc" ></el-avatar></a>
          <template #dropdown>
            <el-dropdown-menu class="w-40 text-center">
              <el-dropdown-item @click="outLogin" class="text-xl text-center"><div class="text-xl text-center">退出登录</div></el-dropdown-item>
              <el-dropdown-item class="text-xl text-center"><div class="text-xl text-center "@click="publishResource">发布资源</div></el-dropdown-item>
              <el-dropdown-item class="text-xl text-center" ><a href="backManage.html">进入后台</a></el-dropdown-item>
            </el-dropdown-menu>
          </template>
        </el-dropdown>
      </div>

<!--         <div v-if="isLoggedIn">-->

<!--                     <el-button >退出登录</el-button>&ndash;&gt;-->
<!--           <el-button @click="publishResource">发布资源</el-button>&ndash;&gt;-->
<!--           <a href="/"><el-button>返回首页</el-button></a>&ndash;&gt;-->
<!--           <a :href="'/user.html?userId='+userId"><el-avatar size="large" shape="circle" :src="picSrc" ></el-avatar></a>-->

<!--       </div>-->
    </div>
    <div class="bg-blue w-1/6"></div>


  </el-header>
</template>

<style scoped>

</style>